import { scene } from '../scene/index'
import Cuboid from '../block/cuboid'
import Cylinder from '../block/cylinder'
import ground from '../objects/ground'
import bottle from '../objects/bottle'

class GamePage {
  constructor(callbacks) {
    this.callbacks = callbacks
  }

  init () {
    this.scene = scene
    this.ground = ground
    this.bottle = bottle
    this.scene.init()
    this.ground.init()
    this.bottle.init()
    this.addInitBlock()
    this.addGround()
    this.addBottle()
    this.bindTouchEvent()
    this.render()
  }

  bindTouchEvent () {
    canvas.addEventListener('touchstart', this.touchStartCallback.bind(this))
    canvas.addEventListener('touchend', this.touchEndCallback.bind(this))
  }

  removeTouchEvent() {
    canvas.removeEventListener('touchstart', this.touchStartCallback)
    canvas.removeEventListener('touchend', this.touchEndCallback)
  }

  touchStartCallback () {
    console.log('touchStart')
    this.bottle.shrink()
    this.currentBlock.shrink()
  }
  touchEndCallback () {
    console.log('touchEnd')
    this.bottle.stop()
    this.currentBlock.rebound()
    this.bottle.rotate()
  }


  render () {
    if(this.currentBlock) {
      this.currentBlock.update()
    }
    this.scene.render()
    if (this.bottle) {
      this.bottle.update()
    }
    requestAnimationFrame(this.render.bind(this))
  }

  addGround () {
    this.scene.instance.add(this.ground.instance)
    this.bottle.showup()
  }

  addInitBlock () {
    const cuboidBlock = this.currentBlock = new Cuboid(-15, 0, 0)
    const cylinderBlock = new Cylinder(23, 0, 0)
    this.scene.instance.add(cuboidBlock.instance)
    this.scene.instance.add(cylinderBlock.instance)
  }

  addBottle () {
    this.scene.instance.add(this.bottle.obj)
  }
}

export default GamePage